<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
     #layer1{width:100%;height:200px;background:#39F;}
	        #layer1-1{width:100%;height:150px;background:#39F;}
	        #layer1-2{width:100%;height:50px;background:blue;}
	 #layer2{width:100%;height:500px;background:white;}
			  #layer2-1{width:25%;height:500px;background:#39F;float:left;}
			   #layer2-2{width:50%;height:500px;background:#0F3;float:left;}
			    #layer2-3{width:25%;height:500px;background:#39F;float:left;}  
				  #layer2-4{clear:both;}
	 #layer3{width:100%;height:50px;background:blue;}
	 .head{color:black;text-align:center;font-size:40px;line-height:150px;}
	 #layer1-2 a{  float:left;
	               font-size:20px;
	               color:#FFF;
				   width:20%;
				   height:10px;
				   line-height:50px;
				   text-align:center;
				   text-decoration:none;
	           }
      #layer2-1 a{
		          height:4em;
				  width:100%;
				  display:block;
				  
				  text-align:center;
				  border-left:20px solid yellow;
				  border-top:1px solid white;
				  text-decoration:none;
				  background:#66F
				   }
   
	 
</style>
</head>

<body>
        <div id="layer1">            
                                                  <div id="layer1-1"><p class="head">商苑论坛</p></div>         
                                                     <div id="layer1-2"><a href="#">学习</a>   <a href="#">体育</a>   <a href="#">娱乐</a>   <a href="#">青春</a>    </div>        
                  </div>
        <div id="layer2">             
                                                      <div id="layer2-1"><p class="head1">学院板块</p><hr size="3"width="80%"align="left"/>
                                                      <a href="#">工商管理学院</a>   <a href="#">会计金融学院</a>   <a href="#">信息与艺术学院</a>   <a href="#">智能服务学院</a>   <a href="#">公共管理学院</a>   <a href="#">食品药品学院</a>
                                                                                           </div>              
                                                          <div id="layer2-2"><p class="head2">帖子内容</p><hr size="3"width="80%" /></div>                  
                                                                <div id="layer2-3"><p class="head3">热帖排行</p><hr size="3"width="80%" /></div>     
                                                                      <div id="layer2-4"><p class="foot">学校地址：济南市旅游路4516号 编码：2250103</p></div>     
                     </div>
        <div id="layer3"></div>
</body>
</html>
